import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_1800/router/navigatorUtil.dart';
import 'package:flutter_1800/tools/AppUtil.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';

class UserCenterViewPage extends StatefulWidget {
  final String? id;

  const UserCenterViewPage({
    Key? key,
    this.id = "",
  }) : super(key: key);

  @override
  _UserCenterViewPageState createState() => _UserCenterViewPageState();
}

class _UserCenterViewPageState extends State<UserCenterViewPage>
    with AutomaticKeepAliveClientMixin {
  var list = [];
  var cats = [];
  var user;
  final RefreshController _refreshController =
      RefreshController(initialRefresh: false);

  @override
  void initState() {
    this.getUser();
  }

  @override
  bool get wantKeepAlive => true;

  void getUser() async {}

  void _onRefresh() async {
    // monitor network fetch
    // await Future.delayed(Duration(milliseconds: 1000));
    // // if failed,use refreshFailed()
    _refreshController.refreshCompleted();
  }

  void _onLoading() async {
    // monitor network fetch
    // await Future.delayed(Duration(milliseconds: 1000));
    // // if failed,use loadFailed(),if no data return,use LoadNodata()
    // items.add((items.length+1).toString());
    // if(mounted)
    // setState(() {

    // });
    _refreshController.loadComplete();
  }

  void registerHandler() {
    NavigatorUtil.goPageReplace(context, "/register");
  }

  // 弹出底部菜单列表模态对话框
  Future<int?> _showModalBottomSheet() {
    return showModalBottomSheet<int>(
      context: context,
      builder: (BuildContext context) {
        return Container(
          height: 150,
          child: Column(
            children: [
              GestureDetector(
                behavior: HitTestBehavior.opaque,
                onTap: () {
                  Navigator.pop(context);
                  String url = Uri.encodeComponent(
                      "https://www.xiaowanwu.cn/safe/jubao");
                  NavigatorUtil.jump(context, "/linkWeb?url=" + url);
                },
                child: Container(
                  padding: EdgeInsets.all(10),
                  width: double.infinity,
                  alignment: Alignment.center,
                  child: const Text(
                    "举报",
                    textAlign: TextAlign.left,
                    style: TextStyle(
                        fontSize: 18, color: Color.fromRGBO(0, 0, 0, 1)),
                  ),
                ),
              ),
              GestureDetector(
                child: Container(
                  padding: EdgeInsets.all(10),
                  child: ElevatedButton(
                      child: const Text("取消"),
                      style: ElevatedButton.styleFrom(
                        minimumSize: const Size(double.infinity, 50),
                        shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(30)),
                      ),
                      onPressed: () {
                        Navigator.pop(context);
                      }),
                ),
              )
            ],
          ),
        );
      },
    );
  }

  void clickGood(item) {
    // ApiService.addResourceGood(item["id"]).then((value) {
    //   this.setState(() {
    //     item["isgood"] = !item["isgood"];
    //     item["goodnum"] = item["goodnum"] + (item["isgood"] ? 1 : -1);
    //   });
    // });
  }

  @override
  Widget build(BuildContext context) {
    super.build(context);
    Color color = Color(0xff313131);
    if (user == null) {
      return Container();
    }

    return Scaffold(
      extendBodyBehindAppBar: true,
      appBar: AppBar(
        shadowColor: Colors.transparent,
        backgroundColor: Colors.transparent,
        systemOverlayStyle: SystemUiOverlayStyle.light
            .copyWith(statusBarColor: Colors.transparent),
        // title: Text(user != null ? user["nickname"] : "",style:TextStyle(color: Colors.white),),
        centerTitle: true,
        elevation: 0.0,
        leading: IconButton(
          icon: Icon(
            Icons.arrow_back_ios,
            color: Colors.white,
          ),
          onPressed: () {
            NavigatorUtil.goBack(context);
          },
        ),
        actions: <Widget>[
          //导航栏右侧菜单
          IconButton(
              icon: Icon(
                Icons.more_horiz,
                color: Colors.white,
              ),
              onPressed: () {
                _showModalBottomSheet();
              }),
        ],
      ),
      body: Container(
          decoration: new BoxDecoration(color: Color(0xfff7f7f7)),
          child: Column(
            children: [
              Container(
                child: SingleChildScrollView(
                  scrollDirection: Axis.horizontal,
                  child: Container(
                    child: Row(
                      children: cats.map((item) {
                        return Container(
                          margin: EdgeInsets.fromLTRB(
                              AppUtil.getPadding(), 10, 0, 10),
                          child: ClipRRect(
                            borderRadius: BorderRadius.circular(20),
                            child: Container(
                              color: Theme.of(context).primaryColor,
                              padding: EdgeInsets.fromLTRB(10, 5, 10, 5),
                              child: Text(
                                item["name"],
                                style: TextStyle(
                                    color: Color(0xff000000), fontSize: 15),
                              ),
                            ),
                          ),
                        );
                      }).toList(),
                    ),
                  ),
                ),
              ),
              Expanded(
                flex: 1,
                child: SmartRefresher(
                    enablePullDown: true,
                    enablePullUp: true,
                    header: WaterDropHeader(),
                    controller: _refreshController,
                    onRefresh: _onRefresh,
                    onLoading: _onLoading,
                    child: ListView.builder(
                        physics: ClampingScrollPhysics(),
                        itemCount: list.length + 1,
                        // itemExtent: 170.0, //强制高度为50.0
                        itemBuilder: (BuildContext context, int index) {
                          if (index == 0) {
                            return Container(
                              child: Column(
                                children: [
                                  Container(
                                    width: MediaQuery.of(context).size.width,
                                    height:
                                        MediaQuery.of(context).size.width * 0.8,
                                    child: Image(
                                        image:
                                            AssetImage("images/userzone.jpg"),
                                        fit: BoxFit.cover),
                                  ),
                                  Container(
                                      padding: EdgeInsets.fromLTRB(
                                          AppUtil.getPadding(), 10, 10, 10),
                                      color: Colors.white,
                                      child: Row(
                                        children: [
                                          Column(
                                            children: [
                                              Row(
                                                children: [
                                                  Text(
                                                    user['nickname'],
                                                    textAlign: TextAlign.left,
                                                    style: TextStyle(
                                                        fontSize: 16,
                                                        fontWeight:
                                                            FontWeight.bold,
                                                        color:
                                                            Color(0xff000000)),
                                                  ),
                                                  SizedBox(
                                                    width: 10,
                                                  ),
                                                  Container(
                                                    padding:
                                                        EdgeInsets.fromLTRB(
                                                            5, 5, 5, 5),
                                                    decoration: BoxDecoration(
                                                      borderRadius:
                                                          BorderRadius.circular(
                                                              10),
                                                      color: Theme.of(context)
                                                          .primaryColor,
                                                    ),
                                                    child: Text(
                                                      user['score'].toString() +
                                                          "分",
                                                      textAlign: TextAlign.left,
                                                      style: TextStyle(
                                                          fontSize: 13,
                                                          color: Color(
                                                              0xff000000)),
                                                    ),
                                                  ),
                                                ],
                                              ),
                                              Container(
                                                padding: EdgeInsets.fromLTRB(
                                                    AppUtil.getPadding(),
                                                    10,
                                                    10,
                                                    20),
                                                decoration: BoxDecoration(
                                                    color: Colors.white),
                                                child: Text(
                                                  user['signname'] ??
                                                      "他还没有给自己写个签名",
                                                  textAlign: TextAlign.left,
                                                  style: TextStyle(
                                                      fontSize: 13,
                                                      color: Color(0xff888888)),
                                                ),
                                              )
                                            ],
                                          ),
                                          Expanded(child: Container()),
                                          Container(
                                            width: 80,
                                            height: 80,
                                            margin: EdgeInsets.fromLTRB(
                                                0, 10, 5, 0),
                                            child: ClipRRect(
                                                // ClipRRect
                                                borderRadius:
                                                    BorderRadius.circular((40)),
                                                child: Image(
                                                    image: NetworkImage(
                                                        user["headimg"]),
                                                    fit: BoxFit.cover)),
                                          ),
                                        ],
                                      )),
                                ],
                              ),
                            );
                          } else {
                            Map item = list[index - 1];
                            int width = item["width"];
                            int height = item["height"];
                            double iw = MediaQuery.of(context).size.width * 0.9;
                            double ih = iw * height / width;
                            if (ih > 300) {
                              ih = 300;
                              iw = ih * width / height;
                            }

                            return GestureDetector(
                                onTap: () {
                                  var id = item["id"];
                                  NavigatorUtil.jump(
                                      context, '/resourceDetail?id=${id}');
                                },
                                behavior: HitTestBehavior.opaque,
                                child: Container(
                                  padding: EdgeInsets.fromLTRB(10, 10, 10, 10),
                                  margin: EdgeInsets.fromLTRB(
                                      AppUtil.getPadding(),
                                      10,
                                      AppUtil.getPadding(),
                                      10),
                                  decoration: BoxDecoration(
                                    borderRadius: BorderRadius.circular(15),
                                    color: Color(0xffffffff),
                                    boxShadow: [
                                      BoxShadow(
                                          color: Color(0x02000000),
                                          offset: Offset(0.0, 0.0), //阴影y轴偏移量
                                          blurRadius: 2, //阴影模糊程度
                                          spreadRadius: 3 //阴影扩散程度
                                          )
                                    ],
                                  ),
                                  child: Column(
                                    mainAxisAlignment: MainAxisAlignment.start,
                                    crossAxisAlignment:
                                        CrossAxisAlignment.start,
                                    children: [
                                      Row(
                                        children: [
                                          Container(
                                            width: 50,
                                            height: 50,
                                            margin: EdgeInsets.fromLTRB(
                                                0, 10, 5, 0),
                                            child: ClipRRect(
                                                // ClipRRect
                                                borderRadius:
                                                    BorderRadius.circular((25)),
                                                child: Image(
                                                    image: NetworkImage(
                                                        item["userHeadImage"]),
                                                    fit: BoxFit.cover)),
                                          ),
                                          SizedBox(
                                            width: 5,
                                          ),
                                          Expanded(
                                              flex: 1,
                                              child: Container(
                                                margin: EdgeInsets.fromLTRB(
                                                    0, 10, 0, 0),
                                                height: 50,
                                                child: Column(
                                                  crossAxisAlignment:
                                                      CrossAxisAlignment.start,
                                                  mainAxisAlignment:
                                                      MainAxisAlignment
                                                          .spaceBetween,
                                                  children: [
                                                    Text(
                                                      item['nickName'],
                                                      textAlign: TextAlign.left,
                                                      style: TextStyle(
                                                          fontSize: 16,
                                                          fontWeight:
                                                              FontWeight.bold,
                                                          color: Color(
                                                              0xffff3503)),
                                                    ),
                                                    Text(
                                                      item['createdtime'],
                                                      textAlign: TextAlign.left,
                                                      style: TextStyle(
                                                          fontSize: 13,
                                                          color: Color(
                                                              0xff888888)),
                                                    )
                                                  ],
                                                ),
                                              )),
                                          GestureDetector(
                                            onTap: () {
                                              _showModalBottomSheet();
                                            },
                                            child: Container(
                                              child: Icon(Icons.more_vert,
                                                  color: Color(0xffaaaaaa)),
                                            ),
                                          )
                                        ],
                                      ),
                                      Container(
                                        margin: EdgeInsets.fromLTRB(0, 5, 0, 5),
                                        child: Column(
                                          mainAxisAlignment:
                                              MainAxisAlignment.start,
                                          crossAxisAlignment:
                                              CrossAxisAlignment.start,
                                          children: [
                                            item['title'] != ""
                                                ? Container(
                                                    padding:
                                                        EdgeInsets.fromLTRB(
                                                            0, 10, 0, 10),
                                                    child: Text(
                                                      item['title'],
                                                      textAlign: TextAlign.left,
                                                      style: TextStyle(
                                                          fontSize: 18,
                                                          color: Color.fromRGBO(
                                                              0, 0, 0, 1)),
                                                    ),
                                                  )
                                                : Container(),
                                            item["coverimg"] != null
                                                ? Container(
                                                    width: iw,
                                                    height: ih,
                                                    margin: EdgeInsets.fromLTRB(
                                                        0, 10, 0, 0),
                                                    child: ClipRRect(
                                                        // ClipRRect
                                                        borderRadius:
                                                            BorderRadius
                                                                .circular((5)),
                                                        child: Image(
                                                            image: NetworkImage(
                                                                item[
                                                                    "coverimg"]),
                                                            fit: BoxFit.cover)),
                                                  )
                                                : Container(),
                                            SizedBox(height: 10),
                                            Container(
                                              child: Row(
                                                mainAxisAlignment:
                                                    MainAxisAlignment.start,
                                                children: [
                                                  GestureDetector(
                                                    child: Container(
                                                      height: 30,
                                                      child: Row(
                                                        children: [
                                                          Container(
                                                            width: 25,
                                                            height: 25,
                                                            child: SvgPicture
                                                                .asset(
                                                              "assets/svg/comment.svg",
                                                              color: color,
                                                              matchTextDirection:
                                                                  true,
                                                            ),
                                                          ),
                                                          SizedBox(
                                                            width: 5,
                                                          ),
                                                          Text(
                                                            item["commentnum"]
                                                                .toString(),
                                                            style: TextStyle(
                                                                fontSize: 15,
                                                                color: color),
                                                          )
                                                        ],
                                                      ),
                                                    ),
                                                  ),
                                                  SizedBox(width: 70),
                                                  GestureDetector(
                                                    onTap: () {
                                                      clickGood(item);
                                                    },
                                                    child: Container(
                                                      height: 30,
                                                      child: Row(
                                                        children: [
                                                          Container(
                                                            width: 25,
                                                            height: 25,
                                                            child:
                                                                item["isgood"]
                                                                    ? SvgPicture
                                                                        .asset(
                                                                        "assets/svg/hearted.svg",
                                                                        color: Color(
                                                                            0xffff4354),
                                                                        matchTextDirection:
                                                                            true,
                                                                      )
                                                                    : SvgPicture
                                                                        .asset(
                                                                        "assets/svg/heart.svg",
                                                                        color:
                                                                            color,
                                                                        matchTextDirection:
                                                                            true,
                                                                      ),
                                                          ),
                                                          SizedBox(
                                                            width: 5,
                                                          ),
                                                          Text(
                                                            item["goodnum"]
                                                                .toString(),
                                                            style: TextStyle(
                                                                fontSize: 15,
                                                                color: color),
                                                          )
                                                        ],
                                                      ),
                                                    ),
                                                  ),
                                                  // SizedBox(width: 70),
                                                  // GestureDetector(
                                                  //   child: Container(
                                                  //     height: 30,
                                                  //     child: Row(
                                                  //       children: [
                                                  //         Container(
                                                  //           width: 25,
                                                  //           height: 25,
                                                  //           child: SvgPicture
                                                  //               .asset(
                                                  //             "assets/svg/share.svg",
                                                  //             color: color,
                                                  //             matchTextDirection:
                                                  //                 true,
                                                  //           ),
                                                  //         ),
                                                  //         SizedBox(
                                                  //           width: 5,
                                                  //         ),
                                                  //         Text(
                                                  //           item["sharenum"]
                                                  //               .toString(),
                                                  //           style: TextStyle(
                                                  //               fontSize: 15,
                                                  //               color: color),
                                                  //         )
                                                  //       ],
                                                  //     ),
                                                  //   ),
                                                  // )
                                                ],
                                              ),
                                            ),
                                            SizedBox(height: 10),
                                          ],
                                        ),
                                      ),

                                      // GestureDetector(
                                      //   child: Container(
                                      //     margin: EdgeInsets.fromLTRB(10, 5, 10, 5),
                                      //     child: Column(
                                      //       children: [
                                      //         ClipRRect(
                                      //             // ClipRRect
                                      //             borderRadius: BorderRadius.circular((5)),
                                      //             child: Container(
                                      //               width: 50,
                                      //               height: 50,
                                      //               child: Image(
                                      //                   image: NetworkImage(
                                      //                       item["userHeadImage"]),
                                      //                   fit: BoxFit.cover),
                                      //             )),
                                      //         Expanded(
                                      //             flex: 1,
                                      //             child: Padding(
                                      //               padding:
                                      //                   EdgeInsets.fromLTRB(10, 5, 0, 5),
                                      //               child: Column(
                                      //                 crossAxisAlignment:
                                      //                     CrossAxisAlignment.start,
                                      //                 children: [
                                      //                   Text(
                                      //                     item['nickName'],
                                      //                     maxLines: 4,
                                      //                     textAlign: TextAlign.left,
                                      //                     style: TextStyle(
                                      //                         fontSize: 15,
                                      //                         color: Color.fromRGBO(
                                      //                             0, 0, 0, 1)),
                                      //                   ),
                                      //                 ],
                                      //               ),
                                      //             ))
                                      //       ],
                                      //     ),
                                      //   ),
                                      //   onTap: () {
                                      //     // NavigatorUtil.jump(
                                      //     //     context, "/meishiDetail?id=" + item["id"]);
                                      //   },
                                      // )
                                    ],
                                  ),
                                ));
                          }
                        })),
              )
            ],
          )),
    );
  }
}
